
.project-dialog {
  top: 0px !important;
  bottom: 0px !important;
  left: 0px !important;
  right: 0px !important;
  z-index: 500;

  .dialog-body {
    width: 100%;
    height: 100%;
  }

  .title {
    margin: 0;
    font-size: 16px;
    text-transform: uppercase;
  }

  .content {
    position: absolute;
    top: 32px;
    bottom: 0px;
    left: 0px;
    right: 0px;

    .project-view {
      position: absolute;
      left: 0px;
      right: 0px;
      top: 0;
      bottom: 0px;
    }

    .project-controls {
      margin-bottom: 20px;

      .image-button {
        .icon {
          background-color: transparent;
        }
      }

      .split-button .split {
        float: right;
        border: none;

        &:before {
          border-color: #fff;
        }
      }
    }

    .log {
      position: absolute;
      top: 52px;
      left: -1.25rem;
      right: -1.25rem;
      bottom: 0;
      background: #222;
      font-family: MONOSPACE;
      font-size: 11px;

      .log-background {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        .project-image {
          position: absolute;
          top: 0;
          bottom: 0;
          left: 0;
          right: 0;
          background-position: center;
          background-size: cover;
        }
        .project-icon {
          position: absolute;
          top: 50%;
          left: 50%;
          margin-left: -32px;
          margin-top: -38px;
          font-size: 64px;
          opacity: 0.1;
          transform: scale(2);
        }
      }

      .log-view {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: rgba(0,0,0,0.6);
        padding: 20px;
        overflow: auto;
        border: 3px solid transparent;

        &.running {
            border: 3px solid #60a917;
        }

        &.building {
            border: 3px solid #1b6eae;
        }
      }
    }

    .meteor-info {
      position: absolute;
      left: 0;
      bottom: -15px;
      font-size: 9px;

      .icon {
        float: left;
        margin-right: 4px;
      }
    }
  }

  p {
    margin: 0;
    line-height: 1.3;
  }

  .dialog-close-button {
    background-color: transparent !important;
    color: white !important;
    font-size: 37px;
    width: auto;
    height: auto;
    min-height: 0;
    padding: 0px 10px;
  }
}

.error-message {
  .icon {
    display: block;
    font-size: 30px;
    margin: 15px 0;
  }
}
